.container{
  min-height: 100vh;
  display: flex;
  align-items: center;
  flex-direction: column;
}
.title{
  font-size: 36rpx;
  font-weight: bold;
  color: #202536;
  margin-top: 200rpx;
}
.name{
  font-size: 28rpx;
  color: #9497B1;
  margin-top: 30rpx;
}

.scanning-box{
  //width: 100vw;
  //height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  margin-top: 320rpx;
}
@keyframes outside {
  from {
    width: 268rpx;
    height: 268rpx;
  }
  to {
    width: 550rpx;
    height: 550rpx;
  }
}
.bor{
  animation-duration:3s;
  animation-iteration-count: infinite;
  position: absolute;

  border-radius: 50%;
}
.outside{
  box-shadow: 20rpx 20rpx 44rpx 0rpx rgba(32, 37, 54, 0.02);
  display: flex;
  justify-content: center;
  align-items: center;
  animation-name: outside;
}
.in{
  box-shadow: 20rpx 20rpx 34rpx 0rpx rgba(32, 37, 54, 0.04);
  animation-name: outside ;
  animation-delay: 1s;

}
.within{
  box-shadow: 20rpx 20rpx 34rpx 0rpx rgba(32, 37, 54, 0.04);
  animation-name: outside;
  animation-delay: 2s;
}
.img{
  width: 88rpx;
  height: 88rpx;
  border-radius: 50%;
}